<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>入门案列</title>
	</head>
	
	<body>
	<!-- 入门案列步骤：
	 1.导入vue.js文件 html下部编辑
	 2.指定区域进行渲染  需要准备div  vue.js代码
	 3.创建vue.js对象 指定渲染区域 动态调用
	 -->
		
		
		<!-- 2.指定区域 -->
		<div id="app">
			<!-- 在div中展现msg属性 
			插值表达式：{{key}}
			
			-->
			 <h1>{{msg}}</h1>
		</div>
	<!-- 1.导入js文件 -->	
	<script src="../js/vue.js"></script>	
		<!-- 创建vue对象 -->		
		<script >
			/*
			语法：
			1.const：定义常量
			2.let：作用和var类似，有作用域的概念
			3.var 特点没有作用域
			
			*/
		   const APP=new Vue({
			   //1.指定区域 关键字 el（元素缩写）：
			   el: "#app",
			   //2.定义属性
			   data: {
				   //key:value
				   msg: "您好VUE"
			   }
		   })
		</script>
		
		
		
	</body>
	
</html>
